const fs = require('fs')

const path = require('path')

// 创建正则对象, 匹配style标签, 匹配script标签
const regStyle = /<style>[\s\S]*<\/style>/
const regScript = /<script>[\s\S]*<\/script>/

fs.readFile(path.join(__dirname, './files/index.html'), 'utf8', (err, dataStr) => {
  // 1. 读取html文件
  if (err) {
    return console.log('读取html文件失败!', err.message)
  }
  // 2. 解析html文件, 获取到对应的内容
  resolveCSS(dataStr)
  resolveJS(dataStr)
  resolveHTML(dataStr)
})

const resolveCSS = (htmlStr) => {
  // 3.1 匹配style标签
  const r1 = regStyle.exec(htmlStr)
  // 3.2 将匹配到的内容, 进行字符串的替换
  const newCSS = r1[0].replace('<style>', '').replace('</style>', '')
  // 3.3 将替换后的内容, 写入到index.css文件中
  fs.writeFile(path.join(__dirname, './clock/index.css'), newCSS, err => {
    if (err) {
      return console.log('写入CSS文件失败!', err.message)
    }
    console.log('写入CSS文件成功!')
  })
}

const resolveJS = (htmlStr) => {
  // 3.1 匹配script标签
  const r2 = regScript.exec(htmlStr)
  // 3.2 将匹配到的内容, 进行字符串的替换
  const newJS = r2[0].replace('<script>', '').replace('</script>', '')
  // 3.3 将替换后的内容, 写入到index.js文件中
  fs.writeFile(path.join(__dirname, './clock/index.js'), newJS, err => {
    if (err) {
      return console.log('写入JS文件失败!', err.message)
    }
    console.log('写入JS文件成功!')
  })
}

const resolveHTML = (htmlStr) => {
  // 3.1 匹配style标签和script标签, 替换为外链形式
  const newHTML = htmlStr.replace(regStyle, '<link rel="stylesheet" href="./index.css" />').replace(regScript, '<script src="./index.js"></script>')
  // 3.2 将替换后的内容, 写入到index.html文件中
  fs.writeFile(path.join(__dirname, './clock/index.html'), newHTML, err => {
    if (err) {
      return console.log('写入HTML文件失败!', err.message)
    }
    console.log('写入HTML文件成功!')
  })
}